<template lang="pug">
MenuPage
.indexpage
    SearchBar.searchBar(v-on:keyup.enter="SearchGames")
    router-view
BottomBar
</template>
<script setup lang="ts">
import {defineAsyncComponent, onBeforeMount, onMounted} from 'vue'
import {StoreGameInfoSearch} from "../../store";
import {useRouter} from "vue-router";
import SearchBar from "../utils/SearchBar.vue";

const BottomBar = defineAsyncComponent(() =>
    import("../utils/BottomBar.vue")
)
const MenuPage = defineAsyncComponent(() =>
    import("../utils/MenuPage.vue")
)

onBeforeMount(() => {
})
const router = useRouter();

const SearchGames = () => {
    StoreGameInfoSearch().Flush();
    router.push("/index/search")
}
onMounted(() => {

})
</script>


<style lang="sass" scoped>
.indexpage
  display: flex
  flex-direction: column
  width: 100%
  height: 100%


.searchBar
  position: fixed
  margin: 0 0 0 80%
  z-index: 2


</style>
